<style>
  .TablePrefix {font-size: large;font-weight: bold;}
  .rightspace {padding-right: 30px;}
  .aligntop {vertical-align: top;}
</style>
<table>
  <tr>
    <td class="rightspace aligntop">
      <p class="TablePrefix">样品统计数据</p>
      <table class='table table-hover table-verycondensed table-bordered' style="width: auto">
      <tr><td> 采样个数</td>  <td>{{ data.nbrsample }}</td></tr>
      <tr><td> 可见</td>  <td>{{ data.nbrvisible }}</td></tr>
      <tr><td> 不可见</td>  <td>{{ data.nbrnotvisible }}</td></tr>
      <tr><td> 验证对象百分比</td>  <td>{{ data.taxostat.pctobjval }} %</td></tr>
      <tr><td>完全验证的样品比例</td>  <td>{{ data.taxostat.pctval100pct }} %</td></tr>
      <tr><td>部分验证的样品比例</td>  <td>{{ data.taxostat.pctpartval }} %</td></tr>
      </table>
    </td>
    <td class="rightspace aligntop">
      <p class="TablePrefix">最大样品深度 </p>
      <table class='table table-hover table-verycondensed table-bordered' style="width: auto">
        <thead><tr><th>深度分区</th><th>计数</th></tr></thead>
        <tbody>
      {%   for v in data.depthhisto %}
      <tr>  <td> {{ v['slice'] }}</td>  <td>{{ v['nbr'] }}</td>  </tr>
      {%  endfor %}
      </tbody></table>
    </td>
    <td class="aligntop">
      <p class="TablePrefix">每种设备采样数</p>
      <table class='table table-hover table-verycondensed table-bordered' style="width: auto">
        <thead><tr><th>设备</th><th>采样数</th></tr></thead>
        <tbody>
      {%   for v in data.instrumcount %}
      <tr>  <td> {{ v['instrum'] }}</td>  <td>{{ v['nbr'] }}</td>  </tr>
      {%  endfor %}
      </tbody></table>

    </td>
  </tr>
  <tr>
    <td class="rightspace aligntop" colspan="2">
      <p class="TablePrefix">项目统计、状态及数据拥有者表格</p>
      <table class='table table-hover table-verycondensed table-bordered' style="width: auto">
        <thead><tr><th>项目</th><th>设备</th><th width="70px">颗粒物样品</th><th width="90px">生物相关样品</th>
          <th>浮游动物验证百分比</th>
          <th>数据拥有者</th><th>颗粒物项目管理员</th><th>Ecotaxa (zoo)项目管理员 </th><th>颗粒物数据状态</th><th>浮游动物数据状态</th></tr></thead>
        <tbody>
      {%   for v in data.partprojcount %}
      <tr>  <td> {{ v['ptitle'] }}</td>  <td>{{ v['instrumtype'] }}</td><td>{{ v['nbr'] }}</td><td>{{ v['nbrtaxo'] }}</td>
        <td>{{ data.taxostatbyproj[v['pprojid']] }}</td>
      <td><a href="mailto:{{ v['do_email'] or ""}}">{{ v['do_name'] or "" }}</td>
      <td><a href="mailto:{{ v['uppowner_email'] or ""}}">{{ v['uppowner_name'] or "" }}</td>
      <td><a href="mailto:{{ v['email'] or ""}}">{{ v['name'] or "" }}</td>
      <td>{{ {'Y':'Full export','V':'Limited export','N':'Private'}[v['visibility'][0]] }} </td>
      <td>{{ {'Y':'Full export','V':'Visible','N':'Private'}[v['visibility'][1]] }} </td>
      </tr>
      {%  endfor %}
      </tbody></table>
    </td>
    <td class="aligntop">
      <p class="TablePrefix">每个分类项目的样品</p>
      <table class='table table-hover table-verycondensed table-bordered' style="width: auto">
        <thead><tr><th>项目</th><th>样品计数</th></tr></thead>
        <tbody>
      {%   for v in data.taxoprojcount %}
      <tr>  <td> <a href="/prj/{{ v['projid']}}" target="_blank">{{ v['title'] }}</a></td>  <td>{{ v['nbr'] }}</td>  </tr>
      {%  endfor %}
      </tbody></table>
    </td>
  </tr>
</table>

<style>
#taxolist tbody td:nth-child(2),.linklike {cursor: pointer;text-decoration: underline;}
</style>
<table>
  <tr>
    <td class="rightspace aligntop">
      <p class="TablePrefix">包含已注释（已验证）项的类别列表</p>
      <table id="taxolist" class='table table-hover table-verycondensed table-bordered' style="width: auto">
        <thead><tr><th>分类
          - <span class=linklike onclick="SelectTaxoList('');">选择全部</span>
          - <span class=linklike onclick="SelectTaxoList('living');">选择生物</span>
          - 检查分类过滤器完成类别选择
        </th><th>图表</th></tr></thead>
        <tbody>
      {%   for v in data.taxolist %}
      <tr>  <td> {{ v['tree'] }}</td>  <td data-id="{{ v['classif_id'] }}" data-nom="{{v['nom'] }}" >select</td>  </tr>
      {%  endfor %}
      </tbody></table>

    </td>
  </tr>
</table>
<script>
  $("#taxolist").on('click','tbody td:nth-child(2)',function () {
    var id=$(this).data("id");
    var nom=$(this).data("nom");
    $("#taxolb").append($('<option>', {value:id, text: nom,selected:true}));
    $("#taxolb").change();
  });

function SelectTaxoList(prefix)
{
  $("#taxolist tbody tr").each(function () {
    var txt=$(this).find("td:nth-child(1)").text();
    if((prefix=='')||(txt.trim().substr(0,prefix.length)==prefix))
        $(this).find("td:nth-child(2)").click();
  });
}
</script>
{#  {{ raw }}#}